if(!window.Berta) window.Berta = {};
if(!Berta.Pane) Berta.Pane = {};

Berta.Panel.addPaneDefinition('layout', new Class(function(){

	return {
		extend: Berta.Pane,
		
		defaults: {
			type: 'layout'
		},

		defaultTitle: 'Design & Layout',
		
		loading: false,
		loaded: false,
		
		
		constructor: function(options) {
			Berta.Pane.call(this, options);

			var templateSettingDef = Berta.Settings.instance().getDefinition('settings', 'template.template_id');
			var tIndex = templateSettingDef.options.indexOf(Berta.Options.template_id);

			this.setTitle(this.defaultTitle + ' <span>(based on <strong>' + templateSettingDef.optionTitles[tIndex] + '</strong>)</span>');
		},
		
		//   .______    __    __  .______    __       __    ______    ////////////////////////////////////////////////////////////
		//   |   _  \  |  |  |  | |   _  \  |  |     |  |  /      |   ////////////////////////////////////////////////////////////
		//   |  |_)  | |  |  |  | |  |_)  | |  |     |  | |  ,----'   ////////////////////////////////////////////////////////////
		//   |   ___/  |  |  |  | |   _  <  |  |     |  | |  |        ////////////////////////////////////////////////////////////
		//   |  |      |  `--'  | |  |_)  | |  `----.|  | |  `----.   ////////////////////////////////////////////////////////////
		//   | _|       \______/  |______/  |_______||__|  \______|   ////////////////////////////////////////////////////////////

		
		afterOpen: /*override */ function() {
			
			this._(render)();
			this.fireResize();
		},
		
		beforeClose: /* override */ function() {
			
		}
		
		
	};


	//   .______   .______     __  ____    ____  ___   .___________. _______    //////////////////////////////////////////////////
	//   |   _  \  |   _  \   |  | \   \  /   / /   \  |           ||   ____|   //////////////////////////////////////////////////
	//   |  |_)  | |  |_)  |  |  |  \   \/   / /  ^  \ `---|  |----`|  |__      //////////////////////////////////////////////////
	//   |   ___/  |      /   |  |   \      / /  /_\  \    |  |     |   __|     //////////////////////////////////////////////////
	//   |  |      |  |\  \--.|  |    \    / /  _____  \   |  |     |  |____    //////////////////////////////////////////////////
	//   | _|      | _| `.___||__|     \__/ /__/     \__\  |__|     |_______|   //////////////////////////////////////////////////

	function render() {
		if(!this.rendered) {
			this.rendered = true;

			var html = $('<div />'); // Create an empty jquery object (not possible :/ )
			
			// 1. /// Render template choosing block

			var sDef = Berta.Settings.instance().getDefinition('settings', 'template.template_id');
			html.append($('<h4 class="x-pane-subheading" />').html('Template'));
			html.append(
				$('<div />').append(Berta.SettingsRenderer.instance().getRenderedSetting('settings', sDef))
							.append('<p>Note: Changing template will reload the page.</p>')
							.append('<p>Template for this page: ...</p>')
			);
			this.empty();
			this.fill(html);

			Berta.EditorManager.instance().registerEditables(
				html.find('.x-editable'),
				'panel', // Panel context
				null, //this._(onTemplateChange),
				this._(onTemplateChange)
			);

			// 2. /// Add settings for the selected template

			var templateSetting = Berta.Settings.instance().getSetting('settings', 'template.template_id');
			var sDef = Berta.Settings.instance().getDefinitions('template-settings.' + templateSetting.value);
			if (sDef !== null) {
				html.append(Berta.SettingsRenderer.instance().getRenderedFromDefinitions('template-settings.' + templateSetting.value, sDef, 'panel'));
			} else {
				$.logError('Pane.Layout::render: "template-settings.' + templateSetting.value + '" not loaded!');
				html.append('<h4>Error!</h4><p>Settings for the chosen template are not yet loaded</p>');
			}


			// DEBUG...
			this.fill('<h4>DEBUG</h4><p><a href="#" class="x-debug-clear-local-settings">reload settings from server</a></p>');
			this.elements.inside.find('.x-debug-clear-local-settings').click(function() {
				Berta.Settings.instance().clearLocalSettingsCache(true);
				return false;
			});
		}
	}


	function onTemplateChange(editor) {
		//$.log(editor, editor.getValue());

		// Remove all local cache for the current template
		Berta.Settings.instance().clearLocalSettingsCache(Berta.Options.template_id);

		// Remove all local cache for the new template
		Berta.Settings.instance().clearLocalSettingsCache(editor.getValue());

		// Remove settings values
		Berta.Settings.instance().clearLocalSettingsCache(false, true);

		this.disableInteraction();
		window.location.reload();
	}


}()));
